<template>
  <div class="nav2">
    <div class="navin" v-for="item in navresult"  v-on:click="goprolist(item.id)"><img :src="item.imgUrl"/><div v-text="item.name"></div></div>
  </div>
</template>

<script>

export default {
  name: 'nav2',
  props : [],
  data () {
    return {
      navresult:[]
    }
  },
  methods : {
    goprolist(id){
      this.$router.push({ name: 'druglist', query: { id: id }})
    }
  },
  mounted(){
    this.navresult = [
      {"id":1,"name":"呼吸内科","imgUrl":"../../static/img/home_huxi.png"},
      {"id":2,"name":"内分泌科","imgUrl":"../../static/img/home_neifen.png"},
      {"id":3,"name":"妇科","imgUrl":"../../static/img/home_fuke.png"},
      {"id":4,"name":"男科","imgUrl":"../../static/img/home_nanke.png"},
      {"id":5,"name":"儿科","imgUrl":"../../static/img/home_erke.png"},
      {"id":6,"name":"神经内科","imgUrl":"../../static/img/home_shenjing.png"},
      {"id":7,"name":"消化内科","imgUrl":"../../static/img/home_xiaohua.png"},
      {"id":8,"name":"外科","imgUrl":"../../static/img/home_waike.png"},
      {"id":9,"name":"肝胆","imgUrl":"../../static/img/home_gandan.png"},
      {"id":10,"name":"泌尿","imgUrl":"../../static/img/home_miniao.png"}
    ]
  }
}

</script>

<style lang="scss" scoped>
  .nav2{
    margin-top: 1.2rem;
    margin-bottom: 1.2rem;
    .navin{
      display: inline-block;
      width: 20%;
      font-size: 0.8rem;
      padding: 0.5rem 0;
      img{
        width:2rem;
      }
    }
  }
</style>
